<template>
  <van-tabbar v-model="active">
    <van-tabbar-item name="/" replace to="/" icon="home-o">首页</van-tabbar-item>
    <van-tabbar-item name="/regulations" replace to="/regulations" icon="description">政策</van-tabbar-item>
    <van-tabbar-item name="/profile" replace to="/profile" icon="user-o">我的</van-tabbar-item>
  </van-tabbar>
</template>

<script>

export default {
  name: 'Footer',
  data() {
    return {
      active: '/'
    }
  },
  computed: {},
  watch: {
    // 实时监听路由状态
    '$route.path': {
      handler(val) {
        this.active = val
      },
      immediate: true // 立即执行
    }
  },
  mounted() {
  }
}
</script>

<style scoped lang="less" rel="stylesheet/less">
.van-tabbar {
  position: fixed;
  z-index: 100;
}
</style>
